import TinyColor from 'tinycolor2'

const getHoverColor = (baseColor) => {
  return TinyColor(baseColor).lighten(55).toString()
}

/**
 * 获取主题色的Hover
 *
 */
export const getThemeHoverColor = () => {
  // 从 css var中获取主题色
  const baseColor = getComputedStyle(document.documentElement).getPropertyValue(`--form-theme-color`)
  return getHoverColor(baseColor)
}

/**
 * 设置主题相关变量到css  vars
 */
export const setThemeColorVars = (themeColor) => {
  document.documentElement.style.setProperty('--form-theme-color', themeColor)
  document.documentElement.style.setProperty('--form-theme-hover-color', getHoverColor(themeColor))
}
